<template>
	<section>
		<!--start 面包屑-->
		<div class="location">
			<el-breadcrumb separator="/">
				<el-breadcrumb-item :to="{path:'/index'}">首页</el-breadcrumb-item>
				<el-breadcrumb-item>网站开关</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<!--end 面包屑-->
		<!--start content-->
		<div class="wrap" ref="companyWrap">
			<el-form :model="formData" :rules="rules" ref="form" label-width="100px" class="formFontSizeMini scroll">
				<el-row :gutter="20">
					<el-col :span="12">
						<el-form-item label="运营商" prop="cmemberName">
							<el-input id='cmemberName' v-model="formData.cmemberName" placeholder=""></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="20">
					<el-col :span="24">
						<el-form-item label="网站状态:" prop="">
							<el-radio-group v-model="formData.dataBillstate">
								<el-radio class="radio" label="0" checked="checked" >开</el-radio>
								<el-radio class="radio" label="1">关</el-radio>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="20">
					<el-col :span="24">
						<el-form-item label="关闭原因:" prop="cmemberClosePage">
							<script id="addInfoEditor" type="text/plain" style="width:99%;height:400px;"></script>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
		</div>
		<div class="btnBox_180" :class="{btnBox_98:!$store.state.headFold}">
			<el-button type="primary" @click="saveInfo">保存</el-button>
			<el-button @click="cancelFn">取消</el-button>
		</div>
		<!--end content-->
	</section>
</template>

<script>
	const UE = require('UE');// eslint-disable-line
	export default {
		data() {
			return {
				info_editor:null,
				//form的数据
				formData:{
					cmemberName:"",  //运营商名称
					dataBillstate:"",//是否开启
					cmemberClosePage:"",  //关闭原因
				},
				//form控件的校验,注意，rules的校验属性名要跟控件上绑定的变量名一致，并且两者不能属于同个对象下，如a.formData和a.rules!!
				rules: {
					cmemberName: [{required: true,message: '运营商名称不能为空',trigger: 'blur'}],  //运营商名称非空校验
					cmemberClosePage: [{required: true,message: '不能为空',trigger: 'blur'}],  //关闭原因非空校验
				},
				//上传
				vue_uploadUrl:"admin/ftpAjax!uploadFile.htm",
				vue_logoLoad:{
					uploadData:{
						"moduleName":"basic",
						"fileName":""
					},
				},
			}
		},
		methods: {
			handleRemove(file, fileList) {
		        console.log(file, fileList);
		    },
		    handlePreview(file) {
		        console.log(file);
		    },
		    query_systemCmemberData(){  //请求数据
				this.axios({
					method:"GET",
					url:"/v3/system/cmembers"
				}).then((res)=>{
					this.formData = res.data;
				}).catch((err)=>{
					
				})
			},
		    saveInfo(){  //新增通知
		    	this.$refs['form'].validate((vaild)=>{
		    		if(vaild){
		    			this.axios({
		    				method:"PUT",
		    				url:"/v3/system/cmembers/"+localStorage.getItem('cmemberCode'),
		    				data:{
		    					"cmemberName":this.formData.cmemberName,
		    					"cmemberClosePage":this.formData.cmemberClosePage,
		    					"dataBillstate":this.formData.dataBillstate
		    				}
		    			}).then((res)=>{
		    				this.Public.openSuccess(this,"操作成功！")
		    			}).catch((err)=>{
		    				this.Public.openError(this,err.response.data)
		    			})
		    		}
		    	})
		    },
			cancelFn() {
				this.$router.go(-1)
			},
		},
		created() {
			this.query_systemCmemberData();
		},
		mounted() {
			let _this = this;
			this.info_editor = UE.getEditor('addInfoEditor');
			this.info_editor.addListener("contentChange",function(){
				_this.formData.cmemberClosePage = this.getContent()
			});
			/*this.info_editor.addListener("ready",function(){
				this.setContent("大家好");
			});*/
			this.$refs['form'].$el.style.height = (document.documentElement.clientHeight - 175) + 'px';
		},
	  	destroyed() {
		    this.info_editor.destroy();
		}
	}
</script>

<style scoped>
	*{transition:.2s;}
	section {display: flex;flex-direction: column;flex: 1;}
	div.location {flex: 0 0 10px; padding: 3px 0 15px 0;}
	div.wrap {flex: 1;width: 100%;padding: 35px 20px 0 20px;box-sizing: border-box;background: #fff;}
	.scroll {overflow-y: auto;overflow-x: hidden;padding-right: 10px;}
	.title {height: 50px;color: #03B8CC;font-size: 16px;}
	.selectWidth {width: 100%;}
	.btnBox_180 {position: absolute;bottom: 10px;left:180px;height: 50px;background: #fff;z-index: 100;}
	.btnBox_98 {left:98px;}
	/* start upload */
	.avatar-uploader {position: relative;width:720px;height:288px;line-height:288px;text-align:center;border: 1px dashed #d9d9d9;border-radius: 6px;cursor: pointer;overflow: hidden;z-index: 9;}
	.avatar-uploader:hover {border-color: #03B8CC;}
	.avatar-uploader-icon {font-size: 20px;color: #8c939d;width: 95px;height: 95px;line-height: 95px;text-align: center;}
	.certificate {width:372px;}
	/* end upload */
	.intensitySpan{display: inline-block;width: 120px; height: 20px;line-height: 20px;text-align: center!important;background: #e9ecf3;color: #fff;margin-right: 3px!important;font-size: 13px;}
</style>
